<!doctype html>
<html lang="zh-CN" th:replace="admin-layout :: layout(~{::title}, ~{}, ~{::script}, ~{::body}, 'menu-list')"
      xmlns:th="http://www.thymeleaf.org">
<head>
    <title>菜单列表</title>
    <script>
        $(document).on("click", ".removeBtn", function () {
            var id = $(this).data("id");
            confirmAlert(function () {
                ajaxJson("/admin/menu/ajax/delete", {"id": id}, function (res) {
                    if (res.status) {
                        queryLeftList();
                    }
                })
            })
        })

        $(document).on("click", ".statusCheckbox", function () {
            var id = $(this).data("id");
            var newVar = $(this).is(":checked");
            ajaxJson("/admin/menu/ajax/updateStatus", {"id": id, "status": newVar ? 0 : 1}, function (res) {
                if (res.status) {
                    queryLeftList();
                }
            })
        })

        $(document).on("blur", ".sortInput", function () {
            var id = $(this).data("id");
            var sort = $(this).val();
            ajaxJson("/admin/menu/ajax/updateSort", {"id": id, "sort": sort}, function (res) {
                if (res.status) {
                    queryLeftList();
                }
            })
        })

        function queryLeftList() {
            queryList();
            $.post("/admin/menu/child/left/li", function (result) {//无刷新提交表单
                $("#leftLi").html(result);
            })
        }

        $("#searchBtn").click(function () {
            queryList()
        })

        function queryList() {
            $.post("/admin/menu/child/table/tr", $("form").serialize(), function (result) {//无刷新提交表单
                $("tbody").html(result);
            })
        }

        $(function () {
            queryList()
        })
    </script>
</head>
<body>
<ol class="breadcrumb">
    <li class="active">菜单列表</li>
</ol>
<form class="form-inline fyl-mb20" id="form" method="post">
    <div class="form-group">
        <label class="sr-only" for="name">名称</label>
        <input type="text" class="form-control fyl-clear" placeholder="名称" id="name" name="name"
               autocomplete="off">
    </div>
    <span class="btn btn-primary" id="searchBtn">查询</span>
    <span class="btn btn-warning" id="clearSearchBtn">清空</span>
</form>
<div class="fyl-mb20">
    <a th:href="@{/admin/menu/save}" class="btn btn-primary">添加</a>
</div>
<table class="table table-bordered table-hover">
    <thead>
    <tr>
        <th>名称</th>
        <th>链接</th>
        <th>标记</th>
        <th width="150px">顺序</th>
        <th>显示</th>
        <th>操作</th>
    </tr>
    </thead>
    <tbody>

    </tbody>
</table>
</body>
</html>